import { getMeunus } from "@/api/menu";

const state = {
  headMenus: [],
  asideMenus: [
    {
      name: "user",
      text: "用户管理",
      path: "/user",
      icon: "md-person"
    },
    {
      name: "role",
      text: "角色管理",
      path: "/role",
      icon: "ios-people"
    },
    {
      name: "share",
      text: "分享管理",
      path: "/share",
      icon: "md-share"
    },
    {
      name: "post",
      text: "文章管理",
      path: "/post",
      icon: "ios-paper"
    }
  ],
  dropMenus: [],
  asideCollapse: false
};

// actions
const actions = {
  async init({ dispatch }) {
    const [headMenus, asideMenus, dropMenus] = await getMeunus();
    await dispatch("set", {
      headMenus,
      asideMenus,
      dropMenus
    });
  },

  async asideCollapseToggle({ state, dispatch }) {
    await dispatch(
      "db/set",
      {
        dbName: "sys",
        path: "menu.asideCollapse",
        user: true,
        value: !state.asideCollapse
      },
      { root: true }
    );
    state.asideCollapse = !state.asideCollapse;
    return state.asideCollapse;
  },

  async set({ state, dispatch }, { headMenus, asideMenus, dropMenus }) {
    state.headMenus = headMenus;
    state.asideMenus = asideMenus;
    state.dropMenus = dropMenus;

    // 持久化
    return Promise.all([
      dispatch(
        "db/set",
        {
          dbName: "sys",
          path: "menu.headMenus",
          user: true,
          value: headMenus
        },
        { root: true }
      ),
      dispatch(
        "db/set",
        {
          dbName: "sys",
          path: "menu.asideMenus",
          user: true,
          value: asideMenus
        },
        { root: true }
      ),
      dispatch(
        "db/set",
        {
          dbName: "sys",
          path: "menu.dropMenus",
          user: true,
          value: dropMenus
        },
        { root: true }
      )
    ]);
  },

  async load({ state, dispatch }) {
    const [asideMenus, headMenus, dropMenus, asideCollapse] = await Promise.all(
      [
        dispatch(
          "db/get",
          {
            dbName: "sys",
            path: "menu.asideMenus",
            defaultValue: [],
            user: true
          },
          { root: true }
        ),
        dispatch(
          "db/get",
          {
            dbName: "sys",
            path: "menu.headMenus",
            defaultValue: [],
            user: true
          },
          { root: true }
        ),
        dispatch(
          "db/get",
          {
            dbName: "sys",
            path: "menu.dropMenus",
            defaultValue: [],
            user: true
          },
          { root: true }
        ),
        dispatch(
          "db/get",
          {
            dbName: "sys",
            path: "menu.asideCollapse",
            defaultValue: true,
            user: true
          },
          { root: true }
        )
      ]
    );
    state.asideMenus = asideMenus;
    state.headMenus = headMenus;
    state.dropMenus = dropMenus;
    state.asideCollapse = asideCollapse;
  }
};

export default {
  namespaced: true,
  state,
  actions
};
